<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html">
      
<head>
	<title>Login</title>
	<script src="http://ajax.googleapis.com/ajax/libs/dojo/1.7.1/dojo/dojo.js" 
	data-dojo-config="isDebug: true, async: false, parseOnLoad: true"/>
	<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/dojo/1.7.1/dijit/themes/claro/claro.css"/>
	<script>
	dojo.require("dijit.form.ValidationTextBox");
	function func(){
		dojo.byId('form:idHidden').value = dojo.byId('id').value;
		dojo.byId('form:passwordHidden').value = dojo.byId('password').value;
		return true;
	}	
	</script>
</head>
<h:body class="claro">

<div align="center">
<table class="title">
  <tr><th>Login</th></tr>
</table>
<p/>
<fieldset>
<legend>Insert your Id and password to log in the system</legend>
<h:form id="form">
  <label for='id'>Id:</label> 
  <input type="text" name="id" value=""
    data-dojo-type="dijit.form.ValidationTextBox" id="id" onkeyup="func();"
    data-dojo-props="regExp:'[A-Za-z0-9]+', required:true, invalidMessage:'Invalid.'"/>
   <br/>
  <label for='password'>Password:</label> 
  <input type="password" name="password" value="" id="password" onkeyup="func();"
    data-dojo-type="dijit.form.ValidationTextBox"
    data-dojo-props="regExp:'\\d{6}', required:true, invalidMessage:'Invalid.'"/>
  <br/>
  <h:inputHidden id='idHidden' value="#{controller.user.id}"/>
  <h:inputHidden id='passwordHidden' value="#{controller.user.password}"/>
  <h:commandButton value="Submit" action="#{controller.login}" onClick="return func();"/>  
</h:form>
</fieldset>
</div></h:body></html>
